<template>
  <div class="ind-lvl-info" :title="pinfo">
    {{ pinfo }}
  </div>
</template>

<script>
export default {
  name: 'IndLvlInfo',
  components: {},
  props: {
    indInfo: {
      type: Object,
    },
  },
  data() {
    return {
      pinfo: '',
    }
  },
  computed: {},
  watch: {},
  created() {
    if (this.indInfo) {
      this.pinfo = this.getLvlDisplay(this.indInfo)
    }
  },
  mounted() {},
  methods: {
    getLvlDisplay(ind) {
      if (ind?.indexName) {
        if (ind.pidName) {
          return ind.pidName + ' > ' + ind.indexName
        }
        return ind.indexName
      }
      return ''
    },
  },
}
</script>
<style lang="scss" scoped>
.ind-lvl-info {
  color: #888;
  font-size: 14px;
  line-height: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 10px;
}
</style>
